<div class="edit">
    <form id="editForm" method="post">
        <div id="win">
        <table class="infobox" width="100%" border="0" cellspacing="5px"
               cellpadding="1px">
            <tr>
                <td width="15%"><label>字典名称：</label></td>
                <td width="35%"><input name="name" type="text" style="width:200px;" value="${(dataDictionary.name)!''}"
                                       class="easyui-validatebox" autocomplete="off"/></td>
                <td width="15%"><label>字典代码：</label></td>
                <td width="35%"><input name="code" type="text" style="width:200px;" value="${(dataDictionary.code)!''}"
                                       class="easyui-validatebox" autocomplete="off"/></td>
            </tr>
            <tr>
                <td width="15%"><label>备注：</label></td>
                <td colspan="3"><input name="remark" type="text" style="width:300px;" value="${(dataDictionary.remark)!''}"
                                       class="easyui-validatebox" autocomplete="off"/></td>
            </tr>
        </table>
            <div id="toolbar">
                <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onclick="append()">新增类型</a>
                <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="removeit()">删除类型</a>
                <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-save',plain:true" onclick="accept()">保存更改</a>
            </div>
        </div>
        <table id="dg" class="easyui-datagrid" style="width:100%;height:auto"
               data-options="
				singleSelect: true,
				toolbar: '#win',
				url: '/dictionary/getDetail?id=${(dataDictionary.id)!"-1"}',
				fitColumns:true,
				method: 'get',
				onClickRow: onClickRow
			">
            <thead>
            <tr>
                <th data-options="field:'name',width:250,editor:'textbox',align:'center'">类型名称</th>
                <th data-options="field:'code',width:250,editor:'textbox',align:'center'">类型代码</th>
            </tr>
            </thead>
        </table>
        <input hidden type="text" name="id" value="${(dataDictionary.id)!''}">
    </form>
</div>
<script type="text/javascript">
    $(function () {

    });
    var editIndex = undefined;
    function endEditing(){
        if (editIndex == undefined){return true}
        if ($('#dg').datagrid('validateRow', editIndex)){
//            var ed = $('#dg').datagrid('getEditor', {index:editIndex,field:'attribute'});
//            var name = $(ed.target).combobox('getText');
//            $('#dg').datagrid('getRows')[editIndex]['name'] = name;
            $('#dg').datagrid('endEdit', editIndex);
            editIndex = undefined;
            return true;
        } else {
            return false;
        }
    }
    function onClickRow(index){
        if (editIndex != index){
            if (endEditing()){
                $('#dg').datagrid('selectRow', index)
                        .datagrid('beginEdit', index);
                editIndex = index;
            } else {
                $('#dg').datagrid('selectRow', editIndex);
            }
        }
    }
    function append(){
        if (endEditing()){
            $('#dg').datagrid('appendRow',{});
            editIndex = $('#dg').datagrid('getRows').length-1;
            $('#dg').datagrid('selectRow', editIndex)
                    .datagrid('beginEdit', editIndex);
        }
    }
    function removeit(){
        if (editIndex == undefined){return}
        $('#dg').datagrid('cancelEdit', editIndex)
                .datagrid('deleteRow', editIndex);
        editIndex = undefined;
    }
    function accept(){
        if (endEditing()){
            $('#dg').datagrid('acceptChanges');
        }
    }
    function reject(){
        $('#dg').datagrid('rejectChanges');
        editIndex = undefined;
    }
    function getChanges(){
        var rows = $('#dg').datagrid('getChanges');
        alert(rows.length+' rows are changed!');
    }
</script>